/*
Theme Name: Untitled
Description: Minimal HTML5 & CSS3 theme for my blog 
Author: Amit M B
Author URI: http://www.webddtuts.blogspot.com
Version: 0.1
License: GNU General Public License
-----------------------------------------*/
/*  Table of contents(Search for /$. )
==================================================*/
1.HTML5 reset by Andy Clarke (Customised according to our needs)
	body(for defining default fonts and colors)
2.Frequently used selectors (.clearfix,.alignleft, .alignright,.assistive-text)
3.Links and paragraphs
4.Headings
5.Layout
6.Header
7.Navigation
8.Posts
    8a.Post-title
    8b. Post-Meta-data
    8c. Post Images
    8d. PCB -Pre-Code-Blockquotes
    8e. Tables
    8f. Read More links
9. Forms    
10. Sidebar
    10b. Sidebar Lists
11. Comments
12. Next and Prev Buttons
13. Misc (post img, iwdget img, youtubeBorder, blockquote styling)
14. Responsive Design with media queries
    @media
    
    @media print
15.Homepage specific styling
16.All pages except homepage
17/Only post pages
=======================================*/
/* 
This theme uses HTML boilerplate(customised according to our needs) link: [http://html5boilerplate.com]
For more specifically on CSS, go to [http://html5boilerplate.com/docs/css/]
=======================================*/
/* ==========================  Chrome Frame Prompt   =============== */
.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: black;
    padding: 0.2em 0;
}

/* /1.HTML5 Reset by Andy Clarke
=======================================*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block }
.section, .widget {
    margin: 0;
    padding: 0;
}

body {
    background-color: #eee;
    font: 15px/150% Helvetica,"Myriad Pro", Myriad, Tahoma, Geneva, "Helvetica Neue",Arial, sans-serif;
    color: #333;
    background: #fff url(http://media.smashingmagazine.com/themes/smashingv4/images/body.gif);
}

/*===IE :( ===*/
html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
html, button, input, select, textarea {
    font-family: sans-serif;
    color: #222;
}
svg:not(:root) { overflow: hidden }
/*====Typography Reset====*/
abbr[title] { border-bottom: 1px dotted }
b, strong { font-weight: bold }
blockquote { margin: 1em 40px }
dfn { font-style: italic }
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}
ins {
    background: #ff9;
    color: #000;
    text-decoration: none;
}
mark {
    background: #ff0;
    color: #000;
    font-style: italic;
    font-weight: bold;
}
pre, code, kbd, samp {
    font-family: monospace, serif;
    _font-family: 'courier new', monospace;
    font-size: 1em;
}
pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
}
q { quotes: none }
q:before, q:after {
    content: "";
    content: none;
}
sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup { top: -0.5em }
sub { bottom: -0.25em }
/*====Lists====*/
ul, ol {
    margin: 1em 0;
    padding: 0 0 0 40px;
}
dd { margin: 0 0 0 40px }
nav ul, nav ol {
    list-style: none;
    list-style-image: none;
    margin: 0;
    padding: 0;
}
/*====Images====*/
img {
    border: 0;
    -ms-interpolation-mode: bicubic;
    vertical-align: middle;
}
svg:not(:root) { overflow: hidden }
/* ===Forms Reset==== */
form { margin: 0 }
fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}
label { cursor: pointer }
legend {
    border: 0;
    *margin-left: -7px;
    padding: 0;
    white-space: normal;
}
button, input, select, textarea {
    font-size: 100%;
    margin: 0;
    vertical-align: baseline;
    *vertical-align: middle;
}
button, input { line-height: normal }
button, input[type="button"], input[type="reset"], input[type="submit"] {
    cursor: pointer;
    -webkit-appearance: button;
    *overflow: visible;
}
button[disabled], input[disabled] { cursor: default }
input[type="checkbox"], input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none }
button::-moz-focus-inner, input::-moz-focus-inner {
    border: 0;
    padding: 0;
}
textarea {
    overflow: auto;
    vertical-align: top;
    resize: vertical;
}
input:valid, textarea:valid { }
input:invalid, textarea:invalid { background-color: #f0dddd }
/*====Tables====*/
table {
    border-collapse: collapse;
    border-spacing: 0;
}
td { vertical-align: top }

/* /2.Frequently used selectors
=======================================*/
.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
* html .clearfix { zoom: 1 } /* IE6 */
*:first-child+html .clearfix { zoom: 1 } /* IE7 */
.alignleft { float: left }
.alignright { float: right }
.assistive-text { display: none }

/* Author Styles
=======================================*/
/* /3. Links and Paragraphs
=======================================*/
a {
    text-decoration: underline;
    color: #000;
    outline: none;
}
a:visited { color: #000 }
a:hover { text-decoration: none }
a:focus { outline: thin dotted }
a:active { outline: 0 }
p {
    margin: 0 0 1.2em;
    padding: 0;
}
/* /4. Headings
=======================================*/
h1, h2, h3, h4, h5, h6 {
    font-family: 'Lustria', Georgia,"Times New Roman", Times, serif;
    line-height: 1.4em;
    margin: 1.4em 0 .2em;
    font-weight: normal;
    color: #000;
}
h1 { font-size: 2em }
h2 { font-size: 1.6em }
h3 { font-size: 1.5em }
h4 { font-size: 1em }
h5 { font-size: 1.2em }
h6 { font-size: 1em }

/* /5.Layout
=======================================*/
#wrapper {
    width: 1200px;/*Important: Change this width according to the width of the user browser later*/
    margin: 0 auto;
    background: #fff;
    padding: 20px 0 20px 20px;
}
#main {
    margin: 0 auto;
    padding: 10px 0;
    width: 96%;
}
#content {
    float: left;
    width: 750px;
    position: relative;
    nowhitespace: afterproperty;
    /*content does not expand when zoomed out*/
    margin: 13px 0 0 0;
}
#sidebar {
    float: right;
    width: 26%;
    background-color: #eee;
    padding: 35px;
}
div.footer-wrap {
    margin: 0 auto;
    width: 98%;
    margin-top: 2%;
}
div.footer-widget {
    width: 30%;
    float: left;
    margin-left: 1%;
    margin-right: 1%;
}

/* /6. Header
=======================================*/
#head-wrap { padding-bottom: 30px; }
#header {
    position: relative;
    height: 100px;
    z-index: 100;
    width: 50%;
    float: left;
}
layout div#header {
    height: 100px;
    padding: 0;
    margin-top: 100px;
}
#header-inner {
    position: relative;
    top: 44px;
    left: 20%;
}
#header-inner a, #header-inner h1, .titlewrapper a, .titlewrapper h1 {
    float: left;
    font: bold 34px/100% Helvetica, Georgia, "Times New Roman", Times, serif;
    color: #000;
    text-decoration: none;
    letter-spacing: -.02em;
    margin: 0;
}
#site-title a:hover { text-decoration: none }
p.description {
    position: absolute;
    top: 40px;
    font: italic 16px/110% "Times New Roman", Times, serif;
    color: #ccc;
}

/* /7. Navigation
=======================================*/
#menu {
margin: 0 20px 10px 20px;
padding: 10px 40px;
border-bottom: 2px solid black;
}
#menu ul { list-style: none }
#menu li {
    float: left;
    margin: 0 20px 0 0;
    position: relative;
}
#menu a {
    display: block;
    padding: 12px 5px 0 0;
    margin: 0 5px 0 0;
    text-shadow: 0 1px 0 #fff;
    font: 14px/110% Helvetica,Georgia, "Times New Roman", Times, serif;
    color: #999;
    text-decoration: none;
    border-top: solid 1px transparent;
}
#menu a:hover { color: #000 }
#menu a:active { color: #000 }

#search-box {
    position: relative;
    width: 30%;
    margin: 0;
    float: right;
    top: 80px;
}
#submit-button { display: inline }

/* /8. Posts
=======================================*/
.post-content-wrap{
    padding-left: 122px;
    width: 575px;
    line-height: 1.6em;
}
.hentry {
    position: relative;
    margin-bottom: 30px;
}
.hentry-img { margin: 10px 0 20px }
.hentry:first-of-type { padding-top: 0 }
.post{
    padding:0 20px 0 10px;
    background: #fff;
    position: relative;
}

/* /8a. Post-title
=======================================*/
.hentry .entry-title {
    font: bold 26px/130% Georgia, "Times New Roman", Times, serif;
    font-variant: small-caps;
    margin: 0 0 6px;
    padding: 0;
    color: #000;
}
.hentry .entry-title a {
    color: #000;
    text-decoration: none;
}
.hentry .entry-title a:hover { color: #444444 }

/* /8b. Post-Meta-data
=======================================*/
.post-header {
    left: 0;
    line-height: 125%;
    position: absolute;
    text-align: right;
    top: 30px;
    width: 100px;
    color: #666666;
}
.post-header span {
    margin-right: .8em;
}
.post-header a {
    color: #666666;
    text-decoration: none;
}
.post-header a:hover {
    color: #000;
    text-decoration: none;
}
span.header-date{
  border-bottom: solid 1px #333;
  display: block;
  margin: 0 0 10px;
  padding-bottom: 15px;
  font-variant: small-caps;
  font-style: italic;
}
span.post-labels{
    display: block;
}
.post-labels a {
    font-size: 10px;
}
a.comment-link{
    display:inline-block;
    margin: 10px 0;
}
.toolset {
    margin-top: 1em;
    padding: 0;
    text-align: left;
}
.toolset span{display: block;}
.toolset a {
    border-bottom: 1px dashed #EEEEEE;
    display: block;
    font: small-caps bold 12px Arial !important;
    padding: 0.75em 0;
    text-align: left;
    text-decoration: none;
}
.toolset span a#printStory { }
.toolset span a#savePDF { }

/* /8c. Post Images
=======================================*/
figure, figure.alignleft { margin: 0 20px 20px 0 }
figure.alignright { margin: 0 0 20px 20px }
figure { margin-left: -40px }


/* /8d. PCB -Pre-Code-Blockquotes
=======================================*/
pre {
    background: #464646;
    border: solid #121212;
    border-width: 2px 0 2px 0;
    border-radius: 5px;
    color: #fff;
    padding: 20px;
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
}
code {
    background: #cecece;
    font-size: 14px;
    padding: 3px;
    border-radius: 3px;
}
pre code {
    background: none;
    font-size: 16px;
}
q { font-style: italic }
blockquote + p { margin-left: 20px }
blockquote + p, blockquote + cite, blockquote + p cite { font: 18px Garamond, 'Droid Serif', Georgia, serif }

/* /8e. Tables
=======================================*/
tr:nth-child(2n) td {
    background: #f7f7f7; /* Different bg-color for every odd td*/
}
/* /8f. Read More links
=======================================*/
a.jump-link {
    display: inline-block;
    font-size: 12px;
    margin-top: 7px;
}
a.jump-link:hover {
    color: #000;
    text-shadow: none;
}
a.jump-link:active{
    background-color:#f5f5f5;
}

/* /9. Forms
=======================================*/
input[type=text], input[type=password], textarea {
    border: solid 1px #eaeaea;
    border-top-color: #d5d5d5;
    border-bottom-color: #f4f4f4;
    padding: 5px 7px 6px;
    background: #f9f9f9;
    color: #666;
}
textarea:focus, input[type=password]:focus, input[type=text]:focus {
    border: solid 1px #ccc;
    color: #000;
}
input[type=reset], input[type=submit] {
    background: #666;
    color: #fff;
    border: none;
    padding: 5px 7px;
    cursor: pointer;
}
input[type=reset]:hover, input[type=submit]:hover {
    background: #000;
    color: #fff;
}

/* /10. Sidebar
=======================================*/
#sidebar { }
#sidebar .widget { padding: 20px 0 }
#sidebar h2 {
    font: bold 13px/110% Georgia, "Times New Roman", Times, serif;
    letter-spacing: .1em;
    text-transform: uppercase;
    margin: 0 0 7px;
    padding: 0 0 10px;
    border-bottom: solid 1px #ddd;
    color: #000;
}
#sidebar .widget:first-child {
    border-top: none;
    padding-top: 0;
}
#sidebar .widget:last-child { border-bottom: none }

/* /10b. Sidebar Lists
=======================================*/
#sidebar ul {
    margin: 0;
    padding: 0;
}
#sidebar .widget li { line-height: 1.6; }
#sidebar .widget li a { color: #333 }
#ArchiveList ul li.archivedate {
    margin-left: 40px !important;
    list-style: square;
}

/* /11. Comments
=======================================*/
#comments ol {
    list-style: none;
    margin: 0;
    padding: 0;
}
#comments .comment-body ul, #comments .comment-body ol { margin-bottom: 18px }
#comments .comment-body p:last-child { margin-bottom: 6px }
#comments .comment-body blockquote p:last-child { margin-bottom: 24px }
.comment-author { }
.comment-author cite {
    color: #000;
    font-style: normal;
    font-weight: bold;
}
.comment-author .says { font-style: italic }
#respond {
    border-top: solid 1px #ccc;
    margin: 20px 0 20px;
    padding: 10px 0 0;
    position: relative;
    clear: both;
}
#respond p { margin: 0 }
#respond .comment-notes { margin-bottom: 1em }
.children #respond { margin: 0 48px 0 0 }
h3#reply-title {
    font-size: 110%;
    line-height: 100%;
    font-weight: normal;
    text-transform: uppercase;
    color: #000;
    padding: 5px 0;
    margin: 0px;
}
#comments-list #respond { margin: 0 0 18px 0 }
#comments-list ul #respond { margin: 0 }

/* /12. Next and Prev Buttons
=======================================*/
.prev-post, .next-post { font-size: 75% }
.prev-post, .next-post {
    border-top: solid 1px #999;
    font: italic 17px/120% "Times New Roman", Times, serif;
    margin: 40px 0 0;
}
.prev-post a, .prev-post a:link, .prev-post a:visited, .prev-post a:active, .next-post a, .next-post a:link, .next-post a:visited, .next-post a:active {
    text-decoration: none;
    margin: 15px 0 40px;
    display: inline;
    color: #999;
    width: 47%;
}
.prev-post a:hover, .next-post a:hover-post a:hover {
    color: #000;
    text-decoration: none;
}
.next-post span.arrow, .prev-post span.arrow {
    color: #000;
    width: auto;
    font-size: 34px;
    font-style: normal;
    margin-bottom: 20px;
}
/* /13. Misc
=======================================*/
/*USE CLASS youtubeBorder when embeding youtube videos */
.post img, .widget img, .youtubeBorder {
    background: none repeat scroll 0 0 #FFF;
    border: 1px solid #CCC;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0 1px 1px rgba(0,0,0,0.15);
    padding: 4px;
}
blockquote {
    background: #f9f9f9;
    border-left: 1em solid #eee;
    margin: 1.5em 1em;
    padding: .5em 1em;
    quotes: "\201C""\201D";
}
blockquote:first-child { font-size: 120% }
blockquote:last-child { margin-bottom: 0 }

/*
/14.
 * Media queries for responsive design.
 * These follow after, and will override, the primary styles
 * The media queries made here will be cross browser as a result of script from code.google 
=======================================*/
@media screen and (max-width:650px) { 
    #header {
        height: 93px;
        position: relative;
    }
    #header-inner a, #header-inner h1, .titlewrapper a, .titlewrapper h1 { font-size: 140% }
    #content {
        float: none;
        width: 100%;
    }
    #menu {
        float: none;
        width: auto;
    }
    #sidebar {
        float: none;
        width: auto;
    }
}
@media print { 
    * {
        background: transparent !important;
        color: black !important;
        box-shadow: none !important;
        text-shadow: none !important;
        filter: none !important;
        -ms-filter: none !important;
    }
    /* Black prints faster: h5bp.com/s */
    a, a:visited { text-decoration: underline }
    .post a[href]:after {
        content: " (" attr(href) ")";
        font-size: 80%;
        font-style: italic;
    }
    h1 a[href]:after { content: "" }
    abbr[title]:after { content: " (" attr(title) ")" }
    pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
        background: white !important;
    }
    blockquote, ul {
        margin: 0;
        padding: 1pt;
    }
    thead { display: table-header-group }
    /* h5bp.com/t */
    tr, img { page-break-inside: avoid }
    img {
        max-width: 100%!important;
        page-break-inside: avoid;
        page-break-after: avoid;
    }
}
p.post-excerpt:before { content: "Summary: " }
p.post-excerpt:after { content: " By Amit" }
p.post-excerpt {
    font-style: italic;
    font-size: 90%;
}
